<template>
  <div class="home">
    <!-- 首页 -->
    <my-search></my-search>

    <router-link active-class="active" to="/index/attention">关注</router-link>
    <router-link active-class="active" to="/index/recommend">推荐</router-link>
    <router-link active-class="active" to="/index/notes">笔记</router-link>
    <router-link active-class="active" to="/index/video">视频</router-link>
    <router-link active-class="active" to="/index/food">地域美食</router-link>
    <router-link active-class="active" to="/index/activities">活动</router-link>

    <router-view></router-view>
  </div>
</template>

<script>
import MySearch from '@/components/MySearch.vue';
export default {
  data() {
    return {

    }
  },
  components: {
    MySearch,
  }
}
</script>

<style lang="less" scoped>
@import url(../common/less/varible.less);
.home {
  a {
    padding: 5px 5px;
    font-size: 10px;
    margin-bottom: 10px;
  }
}

a.active {
  border-bottom: 3px solid @borderColor;
  font-size: 17px;
  color: @fontColor;
}
</style>
